import './index.scss';
import React, { FC } from "react";
import { Link } from "react-router-dom";
import { useDispatch } from 'react-redux';
import { Dispatch } from 'redux';
import * as types from '../../store/actionTypes';

interface IProps{
  headerTitle: string;
  iconShow: boolean;
}

const Header: FC<IProps> = ({ headerTitle, iconShow }) => {
  const dispatch: Dispatch = useDispatch();

  //点击标题左侧返回按钮时重置state数据
  const setStateDefault: () => void = () => {
    dispatch({type:types.SET_STATE_DEFAULT});
  }

  return (
    <header className= "header" >
      <div className="back-icon">
        {
          iconShow &&
          <Link to="/"
            className="iconfont icon-arrow-left"
            onClick={setStateDefault}
          >
          </Link>
        }
      </div>
      <h1>{ headerTitle}</h1>
    </header>
  );
}

export default Header;